<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">

<div class="layui-container" th:fragment="form(submitBtnText)">
    <div class="layui-form layuimini-form">
        <div class="layui-row layui-col-space10">
            <div class="layui-col-md6">
                <div class="layui-form-item">
                    <label class="layui-form-label required">上级菜单</label>
                    <button class="layui-btn layui-btn-primary pid">
                        <span class="pid-title">请选择上级菜单</span>
                        <i class="layui-icon layui-icon-down layui-font-12"></i>
                    </button>
                    <input type="hidden" name="pid">
                </div>
            </div>
            <div class="layui-col-md6">
                <div class="layui-form-item">
                    <label class="layui-form-label required">菜单类型</label>
                    <div class="layui-input-block">
                        <input type="text" name="type"
                               placeholder="请输入菜单类型" class="layui-input"
                               th:value="${model != null ? model.type : ''}">
                    </div>
                </div>
            </div>
        </div>

        <div class="layui-row layui-col-space10">
            <div class="layui-col-md6">
                <div class="layui-form-item">
                    <label class="layui-form-label required">名称</label>
                    <div class="layui-input-block">
                        <input type="text" name="title" lay-verify="required" lay-reqtext="名称不能为空"
                               placeholder="请输入名称" class="layui-input"
                               th:value="${model != null ? model.title : ''}">
                    </div>
                </div>
            </div>
            <div class="layui-col-md6">
                <div class="layui-form-item">
                    <label class="layui-form-label required">权限标识</label>
                    <div class="layui-input-block">
                        <input type="text" name="perms"
                               placeholder="请输入权限标识" class="layui-input"
                               th:value="${model != null ? model.perms : ''}">
                    </div>
                </div>
            </div>
        </div>

        <div class="layui-row layui-col-space10">
            <div class="layui-col-md6">
                <div class="layui-form-item">
                    <label class="layui-form-label">菜单url</label>
                    <div class="layui-input-block">
                        <input type="text" name="href" placeholder="请输入菜单url" class="layui-input"
                               th:value="${model != null ? model.href : ''}">
                    </div>
                </div>
            </div>
            <div class="layui-col-md6">
                <div class="layui-form-item">
                    <label class="layui-form-label required">排序</label>
                    <div class="layui-input-block">
                        <input type="text" name="sort"
                               placeholder="请输入排序" class="layui-input"
                               th:value="${model != null ? model.sort : ''}">
                    </div>
                </div>
            </div>
        </div>

        <div class="layui-row layui-col-space10">
            <div class="layui-col-md6">
                <div class="layui-form-item">
                    <label class="layui-form-label">icon</label>
                    <div class="layui-input-block">
                        <input type="text" name="icon" placeholder="请输入icon" class="layui-input"
                               th:value="${model != null ? model.icon : ''}">
                    </div>
                </div>
            </div>
            <div class="layui-col-md6">
                <div class="layui-form-item layui-form-text">
                    <label class="layui-form-label">备注信息</label>
                    <div class="layui-input-block">
                        <textarea name="remark" class="layui-textarea" placeholder="请输入备注信息"
                                  th:text="${model != null ? model.remark : ''}">
                        </textarea>
                    </div>
                </div>
            </div>
        </div>

        <input type="hidden" name="id" th:if="${model} != null" th:value="${model != null ? model.id : ''}">

        <div class="layui-row layui-col-space10">
            <div class="layui-col-md6">
                <div class="layui-form-item">
                    <div class="layui-input-block">
                        <button class="layui-btn layui-btn-normal" lay-submit lay-filter="saveBtn"
                                th:text="${submitBtnText}"></button>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script>
        layui.use(['dropdown'], function () {
            let dropdown = layui.dropdown,
                $ = layui.$

            $.ajax({
                type: "GET",
                url: "/sys-menu-api/menu-tree",
                data: {pid: 253},
                dataType: "json",
                success: function (data) {
                    if (data.code === 0) {
                        //无限层级
                        dropdown.render({
                            elem: '.pid',
                            data: data.data,
                            click: function (item) {
                                $('.pid-title').html(item.title)
                                $('input[name="pid"]').val(item.id)
                            }
                        });
                    } else {
                        parent.layer.open({
                            title: 'error',
                            content: data
                        })
                    }
                },
                error: function (obj, data, err) {
                    parent.layer.open({
                        title: 'error',
                        content: data.msg
                    })
                }
            })
        })
    </script>
</div>
</html>